<template>
  <rx-dialog @handOk="handleSubmit" @cancel="cancel">
    <rx-layout>
      <div slot="center" style>
        <rx-fit>
          <div slot="toolheader" foldheader="true" foldbtn="false" border="false">
            <div class="table-page-search-wrapper">
              <a-form layout="inline">
                <a-row :gutter="24">
                  <a-col :span="8">
                    <a-form-item :label="i18n('form.clientId','应用ID')">
                      <a-input :placeholder="i18n('form.clientId','应用ID','input')" v-model="queryParam.Q_CLIENT_ID_S_LK"/>
                    </a-form-item>
                  </a-col>
                  <a-col :span="8">
                    <a-form-item :label="i18n('form.clientName','应用名称')">
                      <a-input :placeholder="i18n('form.clientName','请输入应用名称','input')" v-model="queryParam.Q_CLIENT_NAME_S_LK"/>
                    </a-form-item>
                  </a-col>
                  <a-col :md="8" :sm="24">
                    <span class="table-page-search-submitButtons">
                      <a-button @click="$refs.table.loadData()" icon="search" type="primary">{{ $ti18('rxList.searchBtn', '查询') }}</a-button>
                      <a-button @click="resetSearch1" style="margin-left: 4px">{{ $ti18('rxList.resetBtn', '重置') }}</a-button>
                    </span>
                  </a-col>
                </a-row>
              </a-form>
            </div>
          </div>
          <rx-grid
              ref="table"
              :allowRowSelect="true"
              :multiSelect="false"
              :columns="columns"
              :defaultPageSize="10"
              url="/api-user/user/org/oauthClientDetails/query"
              :queryParam="queryParam"
              data-field="result.data"
              :pageSizeOptions="['10','30','40']"
              id-field="id"
              @selectChange="onSelectChange"
          >
          </rx-grid>
        </rx-fit>
      </div>
    </rx-layout>
  </rx-dialog>
</template>

<script>
import {BaseList, RxFit, RxGrid, RxDialog, Util} from "@lowcode/jpaas-common-lib";

export default {
  name: 'OauthClientDetailsDialog',
  mixins: [BaseList],
  props:["layerid","destroy"],
  components: {
    RxDialog,
    RxFit
  },
  data() {
    return {
      queryParam: {Q_ENABLE__S_EQ: "1"},
      columns: [
        {
          title: this.$ti18('rxList.index','序号'),
          type: 'indexColumn',
          width: 50,
          dataIndex: 'serial',
          scopedSlots: {customRender: 'serial'}
        },
        {title: this.i18n('form.clientName','应用名称'), dataIndex: 'clientName', width: 100},
        {title: this.i18n('form.clientId','应用标识'), dataIndex: 'clientId', width: 100},
        {title: this.i18n('form.redirectUri','回调地址'), dataIndex: 'webServerRedirectUri', width: 150},
        {title: this.i18n('form.Validity','有效期'), dataIndex: 'accessTokenValidity', width: 80},
        {title: this.i18n('form.createByName','创建人'), dataIndex: 'createByName', width: 80},
      ],
    }
  },
  methods: {
    i18n(name,text,key){
        return this.$ti18(name,text,"oauthClientDetails",key);
    },
    resetSearch1() {
      this.queryParam = {Q_ENABLE__S_EQ: "1"};
      this.resetSearch();
    },
    handleSubmit() {
      var obj=this.$refs.table.getSelectedRow();
      if(!obj){
        this.$message.error(this.i18n('msg.tip','至少选择一项！'));
        return;
      }
      Util.closeWindow(this, "ok",obj);
    },
    cancel(){
      Util.closeWindow(this,'cancel');
    },
  }
}
</script>
<style scoped>

</style>

